<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>试卷查看</title>
    <link rel="shortcut icon" href="../image/favicon.ico" type="image/x-icon">

    <link rel="stylesheet" href="../layui/css/layui.css">
    <link rel="stylesheet" href="css/paper_view.css">
    <link rel="stylesheet" href="css/same.css">
    <style>
        .layui-card-header {
            padding: 10px 20px 0px 20px;
            height: 110px;
        }

        /* 改变layui单选框选中颜色 */
        .layui-form-radio:hover *,
        .layui-form-radioed,
        .layui-form-radioed>i {
            color: #1890ff;
        }

        /* 改变layui复选框选中颜色 */
        .layui-form-checked[lay-skin=primary] i {
            border-color: #1890ff !important;
            background-color: #1890ff;
            color: #fff;
        }

        /* 改变layui复选框经过颜色 */
        .layui-form-checkbox[lay-skin=primary]:hover i {
            border-color: #1890ff;
            color: #fff;
        }

        /* 增加layui复选框选中时title内容的颜色 */
        .layui-form-checked[lay-skin=primary] span {
            color: #1890ff;
        }

        .layui-card {
            margin-bottom: 0;
        }

        .delBottom {
            border-bottom: 0;
        }

        .checkSuccess {
            background-color: #f0f9eb !important;
            border-color: #e1f3d8 !important;
            color: #67c23a !important;
        }

        .checkError {
            background-color: #fef0f0 !important;
            border-color: #fde2e2 !important;
            color: #f56c6c !important;
        }

    </style>

</head>

<body style="background-color: #eff3f7;">

    <div id="app">
        <div class="sdd-paper-contain">
            <div class="paper-item-order-fake">
                <div class="paper-item-order">
                    <div class="layui-card" style="height: 93%;overflow:auto">
                        <div class="layui-card-header">
                            <div class="paper-name">{{examPaperResult.examPaperName}}</div>
                            <div class="paper-info">
                                <span>得分：{{examPaperResult.studentScore}}分 / {{examPaperResult.paperScore}}分</span>
                                <div style="margin-top: -15px;">耗时：{{examPaperResult.doTime | dateFormat}}</div>
                            </div>
                        </div>
                        <div class="layui-card-body">
                            <div class="sdd-question-anchor">
                          
                                <a class="sdd-question-span" v-for="(p,i) in paperQuestions" :href="'#'+(i+1)"
                                    :class="{checkSuccess:p.answer==p.paperQuestionInfo.correctAnswer,checkError:p.answer!=p.paperQuestionInfo.correctAnswer}">
                                    {{i+1}}</a>

                            </div>
                        
                        </div>
                    </div>
                </div>
            </div>

            <div class="paper-question-content layui-form">
                <div class="layui-card" v-if="singleCount!=0">
                    <div class="layui-card-header"
                        style="font-size: 18px;font-weight:500;height: 50px;background: #fafafa;border-top: 1px solid #dedede;border-bottom: 1px solid #dedede;">
                        单选题
                    </div>
                    <div class="layui-card-body" style="padding: 30px 30px;font-size: 14px;color: #4c596b;">

                        <div class="body-line" v-for="(p,i) in paperQuestions.slice(0,singleCount)" :id="i+1"
                            :class="{delBottom:i === singleCount-1}">
                            <div class="itemOrder">{{i+1}}.</div>
                            <div class="question-title">{{p.paperQuestionInfo.questionContentInfo.title}}&nbsp;&nbsp;&nbsp;（ {{p.paperQuestionInfo.score}}分 ）</div>
                            <div class="question-content">
                                <label class="label-info">
                                    <input type="radio" :name="'questionSingle'+i"
                                        v-bind:value="p.paperQuestionInfo.questionContentInfo.questionA"
                                        :title="'A.'+p.paperQuestionInfo.questionContentInfo.questionA" lay-filter="test1"
                                        :checked="p.paperQuestionInfo.questionContentInfo.questionA==p.answer">
                                </label>
                                <label class="label-info">
                                    <input type="radio" :name="'questionSingle'+i"
                                        v-bind:value="p.paperQuestionInfo.questionContentInfo.questionB"
                                        :title="'B.'+p.paperQuestionInfo.questionContentInfo.questionB" lay-filter="test1"
                                        :checked="p.paperQuestionInfo.questionContentInfo.questionB==p.answer">
                                </label>
                                <label class="label-info">
                                    <input type="radio" :name="'questionSingle'+i"
                                        v-bind:value="p.paperQuestionInfo.questionContentInfo.questionC"
                                        :title="'C.'+p.paperQuestionInfo.questionContentInfo.questionC" lay-filter="test1"
                                        :checked="p.paperQuestionInfo.questionContentInfo.questionC==p.answer">
                                </label>
                                <label class="label-info">
                                    <input type="radio" :name="'questionSingle'+i"
                                        v-bind:value="p.paperQuestionInfo.questionContentInfo.questionD"
                                        :title="'D.'+p.paperQuestionInfo.questionContentInfo.questionD" lay-filter="test1"
                                        :checked="p.paperQuestionInfo.questionContentInfo.questionD==p.answer">
                                </label>

                            </div>

                            <div class="question-content2">
                                <label class="label-info">
                                    标答：<span v-if="p.paperQuestionInfo.questionContentInfo.questionA==p.paperQuestionInfo.correctAnswer">A</span>
                                    <span v-if="p.paperQuestionInfo.questionContentInfo.questionB==p.paperQuestionInfo.correctAnswer">B</span>
                                    <span v-if="p.paperQuestionInfo.questionContentInfo.questionC==p.paperQuestionInfo.correctAnswer">C</span>
                                    <span v-if="p.paperQuestionInfo.questionContentInfo.questionD==p.paperQuestionInfo.correctAnswer">D</span>
                                </label>
                                <label class="label-info">
                                    结果：<span :class="{el_tag_success:p.doRight==1,el_tag_error:p.doRight==2}">{{p.doRight==1?'正确':'错误'}}</span>
                                </label>
                                <label class="label-info">
                                    得分：<span>{{p.customerScore}}</span>
                                </label>
                                <label class="label-info">
                                    难度：<span :id="'rate'+i"></span>
                                </label>
                                <label class="label-info">
                                    解析：<span>{{p.paperQuestionInfo.questionContentInfo.resolution}}</span>
                                </label>
                            </div>
                        </div>

                    </div>

                </div>

                <div class="layui-card" v-if="multipleCount!=0">
                    <div class="layui-card-header"
                        style="font-size: 18px;font-weight:500;height: 50px;background: #fafafa;border-top: 1px solid #dedede;border-bottom: 1px solid #dedede;">
                        多选题</div>
                    <div class="layui-card-body" style="padding: 30px 30px;font-size: 14px;color: #4c596b;">

                        <div class="body-line"
                            v-for="(p,i) in paperQuestions.slice(singleCount,singleCount+multipleCount)"
                            :id="i+singleCount+1" :class="{delBottom:i=== multipleCount-1}">
                            <div class="itemOrder">{{i+singleCount+1}}.</div>
                            <div class="question-title">{{p.paperQuestionInfo.questionContentInfo.title}}&nbsp;&nbsp;&nbsp;（ {{p.paperQuestionInfo.score}}分 ）</div>
                            <div class="question-content" style="margin-left: 80px;">
                                <input type="hidden" name="correctAnswer" v-bind:value="p.correctAnswer">
                                <input type="hidden" name="paperQuestionId" v-bind:value="p.paperQuestionId">

                                <input type="checkbox" name="questionMultiple" lay-skin="primary"
                                    v-bind:value="p.paperQuestionInfo.questionContentInfo.questionA"
                                    :title="'A.'+p.paperQuestionInfo.questionContentInfo.questionA" lay-filter="test2">
                                <label class="label-info" style="margin-bottom: 5px;"></label>

                                <input type="checkbox" name="questionMultiple" lay-skin="primary"
                                    v-bind:value="p.paperQuestionInfo.questionContentInfo.questionB"
                                    :title="'B.'+p.paperQuestionInfo.questionContentInfo.questionB" lay-filter="test2">
                                <label class="label-info" style="margin-bottom: 5px;"></label>

                                <input type="checkbox" name="questionMultiple" lay-skin="primary"
                                    v-bind:value="p.paperQuestionInfo.questionContentInfo.questionC"
                                    :title="'C.'+p.paperQuestionInfo.questionContentInfo.questionC" lay-filter="test2">
                                <label class="label-info" style="margin-bottom: 5px;"></label>


                                <input type="checkbox" name="questionMultiple" lay-skin="primary"
                                    v-bind:value="p.paperQuestionInfo.questionContentInfo.questionD"
                                    :title="'D.'+p.paperQuestionInfo.questionContentInfo.questionD" lay-filter="test2">
                                <label class="label-info" style="margin-bottom: 5px;"></label>


                                <input type="checkbox" name="questionMultiple" lay-skin="primary"
                                    v-bind:value="p.paperQuestionInfo.questionContentInfo.questionE"
                                    :title="'E.'+p.paperQuestionInfo.questionContentInfo.questionE" lay-filter="test2">
                                <label class="label-info" style="margin-bottom: 5px;"></label>

                            </div>

                            <div class="question-content2">
                                <label class="label-info">
                                    标答：<span>{{p.paperQuestionInfo.correctAnswer}}</span>
                                </label>
                                <label class="label-info">
                                    您的答案：<span>{{p.answer}}</span>
                                </label>
                                <label class="label-info">
                                    结果：<span :class="{el_tag_success:p.doRight==1,el_tag_error:p.doRight==2}">{{p.doRight==1?'正确':'错误'}}</span>
                                </label>
                                <label class="label-info">
                                    得分：<span>{{p.customerScore}}</span>
                                </label>
                                <label class="label-info">
                                    难度：<span :id="'rate'+(i+singleCount)"></span>
                                </label>
                                <label class="label-info">
                                    解析：<span>{{p.paperQuestionInfo.questionContentInfo.resolution}}</span>
                                </label>
                            </div>

                        </div>

                    </div>

                </div>

                <div class="layui-card" v-if="judgeCount!=0">
                    <div class="layui-card-header"
                        style="font-size: 18px;font-weight:500;height: 50px;background: #fafafa;border-top: 1px solid #dedede;border-bottom: 1px solid #dedede;">
                        判断题</div>
                    <div class="layui-card-body" style="padding: 30px 30px;font-size: 14px;color: #4c596b;">

                        <div class="body-line"
                            v-for="(p,i) in paperQuestions.slice(singleCount+multipleCount,singleCount+multipleCount+judgeCount)"
                            :id="i+singleCount+multipleCount+1" :class="{delBottom:i === judgeCount-1}">
                            <div class="itemOrder">{{i+singleCount+multipleCount+1}}.</div>
                            <div class="question-title">{{p.paperQuestionInfo.questionContentInfo.title}}&nbsp;&nbsp;&nbsp;（ {{p.paperQuestionInfo.score}}分 ）</div>
                            <div class="question-content">
                           
                                <label class="label-info">
                                    <input type="radio" :name="'questionJudge'+i"
                                        v-bind:value="p.paperQuestionInfo.questionContentInfo.questionA"
                                        :title="'A.'+p.paperQuestionInfo.questionContentInfo.questionA" lay-filter="test3"
                                        :checked="p.paperQuestionInfo.questionContentInfo.questionA==p.answer">
                                </label>
                                <label class="label-info">
                                    <input type="radio" :name="'questionJudge'+i"
                                        v-bind:value="p.paperQuestionInfo.questionContentInfo.questionB"
                                        :title="'B.'+p.paperQuestionInfo.questionContentInfo.questionB" lay-filter="test3"
                                        :checked="p.paperQuestionInfo.questionContentInfo.questionB==p.answer">
                                </label>
                            </div>

                            <div class="question-content2">
                                <label class="label-info">
                                    标答：<span v-if="p.paperQuestionInfo.questionContentInfo.questionA==p.paperQuestionInfo.correctAnswer">A</span>
                                    <span v-if="p.paperQuestionInfo.questionContentInfo.questionB==p.paperQuestionInfo.correctAnswer">B</span>
                                </label>
                                <label class="label-info">
                                    结果：<span :class="{el_tag_success:p.doRight==1,el_tag_error:p.doRight==2}">{{p.doRight==1?'正确':'错误'}}</span>
                                </label>
                                <label class="label-info">
                                    得分：<span>{{p.customerScore}}</span>
                                </label>
                                <label class="label-info">
                                    难度：<span :id="'rate'+(i+singleCount+multipleCount)"></span>
                                </label>
                                <label class="label-info">
                                    解析：<span>{{p.paperQuestionInfo.questionContentInfo.resolution}}</span>
                                </label>
                            </div>

                        </div>

                    </div>
                </div>

            </div>
        </div>
  =

        <div id="back-top">
            <i class="layui-icon layui-icon-top" style="font-size: 38px;font-weight: 600;"></i>
        </div>

    </div>



    <script src="../layui/layui.js"></script>
    <script src="../layer/layer.js"></script>
    <script src="../js/jquery-1.12.4.min.js"></script>
    <script src="../js/Vue.js"></script>
    <script src="js/same.js"></script>
    <script src="js/paper_view.js"></script>
</body>

</html>